<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width , initial-scale=1.0">
    <title>发布资讯</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
    <link rel="stylesheet" href="/lib/edit-md/css/editormd.css">
    <link rel="stylesheet" href="../../static/css/me.css">
</head>
<body>
<!--导航-->
<nav  class="ui inverted attached segment m-padded-tb-mini m-shadow-small">
    <div class="ui container">
        <div class="ui inverted secondary stackable menu " content="">
             <h2 class="ui teal header item">发布资讯</h2>
        </div>
    </div>
</nav>
<!--中间部分-->
<br><br><br><br><br>
<div class="ui segment">
    <div  class="m-container m-padded-tb-big">
        <div class="ui container">
            <form id="blog-form" th:object="${blog}" action="/admin/blogInputs" method="post"  class="ui form">
                <div class="required field">
                    <div class="ui left labeled input">
                        <input type="text" th:value="*{title}" name="title" placeholder="标题">
                    </div>
                </div>
                <input type="hidden" name="id" th:value="*{id}">
                <div class="required field">
                    <div id="test-editor">
                    <textarea name="content" th:text="*{content}" style="display:none;">### 关于 Editor.md
                        **Editor.md** 是一款开源的、可嵌入的 Markdown 在线编辑器（组件），基于 CodeMirror、jQuery 和 Marked 构建。
                    </textarea>
                    </div>
                </div>
                <div class="required field">
                    <div class="ui left labeled input">
                        <label class="ui teal basic label">首图</label>
                        <input type="text" th:value="*{firstPic}" name="firstPic" placeholder="首图引用地址">
                    </div>
                </div>
                <div class="ui error message"></div>

                <div class="ui right aligned container">
                    <button type="button" class="ui button" onclick="window.history.go(-1)" >返回</button>
                    <button type="button" id="publish-btn" class="ui teal button">发布</button>
                </div>

            </form>
        </div>
    </div>
</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<!--                footer-->
<footer th:replace="_fragments :: footer" class="ui mobile vertical segment m-padded-tb-massive m-shadow-small-footer" style="background-color:#1296db;">
    <div class="ui center aligned container">
        <div class="ui  divided stackable grid">
            <div class="three wide column">
                <div class="ui column">
                    <img src="../static/images/gzhQRCode.jpg" style="width: 120px;height: 120px" alt="">
                </div>
            </div>
            <!--            <div class="three wide column">-->
            <!--                <h4 class="ui  header">联系方式</h4>-->
            <!--                <div class="ui  link list">-->
            <!--                    <a href="#" class="item">17370000889</a>-->
            <!--                    <a href="#" class="item">17370095889</a>-->
            <!--                    <a href="#" class="item">383414428@qq.com</a>-->
            <!--                </div>-->
            <!--            </div>-->
            <div class="three wide column">
                <h4 class="ui  header">联系方式</h4>
                <div class="ui  link list">
                    <a href="#" class="item">17370000889</a>
                    <a href="#" class="item">17370095889</a>
                    <a href="#" class="item">383414428@qq.com</a>
                </div>
            </div>
            <div class="seven wide column">
                <h4 class="ui  header">公司招聘</h4>
                <div class="ui  link list">
                    <p class="m-text-space">

                    </p>
                </div>
            </div>
        </div>
        <div class="ui inverted section divider"></div>
        <p class="m-text-thin">copy right 1195498488</p>
    </div>
</footer>
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>
<script src="/lib/edit-md/editormd.js"></script>
<script type="text/javascript">
    $(function() {
            var testEditor = editormd("test-editor", {
            width: "100%",
            height: 840,
            syncScrolling: "single",
            path: "/lib/edit-md/lib/"
        });
    });
        $('.menu.toggle').click(function () {
        $('.m-item').toggleClass('m-mobile-show');
    });
    $('.ui.dropdown').dropdown({
        on:'hover'
    });


    $('#publish-btn').click(function () {
        $('#blog-form').submit();
    });

    $('.ui.form').form({
       fields:{
           title:{
               identifier:'title',
               rules:[{
                   type:'empty',
                   prompt:'标题：请输入博客标题'
               }]
           },
           content:{
               identifier:'content',
               rules:[{
                   type:'empty',
                   prompt:'标题：请输入博客内容'
               }]
           },
           firstPicture:{
               identifier:'firstPicture',
               rules:[{
                   type:'empty',
                   prompt:'标题：请输入博客首图引用地址'
               }]
           }
       }
    });
</script>
</body>
</html>